layui.use(['laypage', 'layer'], function () {
    var laypage = layui.laypage
        , layer = layui.layer;

    // 分页，点击分页，会执行方法
    //总页数大于页码总数
    // let count = getProductPageCount();
    // console.log(count)
    page();
});
//全局菜系id
let cuisineId = 1;

function cuisineChange(id, obj) {
    //对全局菜系id进行重新赋值
    cuisineId = id;
    //当点击当前div时，给当前div一个颜色样式
    // $("#cuisine" + id).css({"background-color": "red", "color": "white"});
    // $(obj).css({"background-color": "red", "color": "white"});
    // $(obj).addClass("click");
    // $(obj).removeClass("click");
    //对当前所有菜系div去删除样式
    $("#cuisine>div").forEach(function (childObj) {
        $(childObj).removeClass("click");
    });
    //对当前点击的div增加样式
    $(obj).addClass("click");
    page();
}

function page() {
    layui.use(['laypage', 'layer'], function () {
        var laypage = layui.laypage
            , layer = layui.layer;
        let count = getProductPageCount();
        console.log(count);
        laypage.render({
            elem: 'demo1'
            , count: count //数据总数
            , limit: 8
            , async: false //关闭异步
            , jump: function (obj) {
                //得到第几页和每页显示的条数
                console.log(obj)
                let data = {page: obj.curr, limit: obj.limit, whereShow: 2, cuisineId: cuisineId};
                findProductData(data);
            }
        });
    })
}

function getProductPageCount() {
    let count = 0;
    $.ajax({
        url: '/getProductPageCount',
        data: {cuisineId: cuisineId, whereShow: 2},
        type: 'get',
        async: false,
        dataType: 'json',
        success: function (res) {
            console.log(res);
            count = res.count;
        }
    });
    return count;
}

// $(function () {
//     findProductData();
// });

function findProductData(data) {
    $.ajax({
        url: '/product',
        data: data,
        type: 'get',
        dataType: 'json',
        success: function (res) {
            console.log(res);
            setCompanyData(res.companyModel);
            setNavModelData(res.navModelList);
            setProductData(res.productModelList);
        }
    })
}

function setProductData(data) {
    let html = '';
    data.forEach(function (model, index) {
        html += ' <div>\n' +
            '                        <div><img src="' + model.imgHref + '" height="300" width="300"/></div>\n' +
            '                        <div onclick="findByProductId(' + model.id + ')">' + model.name + '</div>\n' +
            '                        <div>\n' +
            '                            价格\n' +
            '                            <price>' + model.normalPrice + '</price>\n' +
            '                        </div>\n' +
            '                        <div>\n' +
            model.content +
            '                        </div>\n' +
            '                    </div>';
    });
    $("#product").html(html);

}

function findByProductId(id) {
    $.ajax({
        url: '/product/findById',
        data: {id: id},
        type: 'get',
        dataType: 'json',
        success: function (res) {
            console.log(res.data);
            let data = res.data;
            //这里需要逻辑判断，到底查询出多少条数据
            if (data.length == 1) {
                setProductDetailData(data[0]);
                setNextData({}, null);

            } else if (data.length == 2) {
                if (data[0].id == id) {
                    setProductDetailData(data[0]);
                    setNextData({}, data[1]);
                } else {
                    setProductDetailData(data[1]);
                    setNextData(data[0], null);
                }
            } else if (data.length == 3) {
                setProductDetailData(data[1]);
                setNextData(data[0], data[2]);
            }
            // setProductDetailData(data[1]);
            // setNextData(data[0], data[2]);

        }
    })

}

function setProductDetailData(data) {
    let html = '  <div>\n' +
        '                        <div style="display: flex">\n' +
        '                            <div><img src="' + data.imgHref + '" id="imgHref" height="300" width="300"/></div>\n' +
        '                            <div>\n' +
        '                                <div id="productName">' + data.name + '</div>\n' +
        '                                <div>市场价：<span id="marketPrice">' + data.marketPrice + '</span></div>\n' +
        '                                <div>价格：<span id="normalPrice">' + data.normalPrice + '</span></div>\n' +
        '                            </div>\n' +
        '                        </div>\n' +
        '                        <div id="content" style="border: 1px solid red;">\n' +
        data.content +
        '                        </div>\n' +
        '                    </div>';
    $("#product").html(html);
}

// {},null
function setNextData(last, next) {
    let aa = '<div>\n' +
        '\n' +
        '                        <div class="data-hover"><span>上一个</span>&nbsp; &nbsp;&nbsp;<span onclick="findByProductId(' + (last.id == undefined ? -1 : last.id) + ')">' + (last.name == undefined ? '无' : last.name) + '</span></div>\n' +
        '                        <div class="data-hover"><span>下一个</span> &nbsp;&nbsp;&nbsp;<span onclick="findByProductId(' + (next == null ? -1 : next.id) + ')">' + (next == null ? '无' : next.name) + '</span></div>\n' +
        '\n' +
        '                    </div>';
    $("#page").html(aa);
}